<template>
  <div>
    <h3 style="margin-bottom:20px;">以下是已经挂号的资料</h3>
    <div style="margin:20px 0px;">
      <el-input v-model="name" placeholder="请输入姓名" style="width:195px;"></el-input>
      <el-button type="primary" icon="search" @click="handleSearch">搜索</el-button>
    </div>
    <el-table :data="tableData" border style="width:100%;">
      <el-table-column fixed label="日期" prop="date" width="150"></el-table-column>
      <el-table-column label="编号" prop="number" width="150"></el-table-column>
      <el-table-column label="姓名" prop="name" width="150"></el-table-column>
      <el-table-column label="年龄" prop="age" width="150"></el-table-column>
      <el-table-column label="联系号码" prop="phone" width="200"></el-table-column>
      <el-table-column label="病情分类" prop="disease" width="200"></el-table-column>
      <el-table-column label="科室位置" fixed="right" prop="position" width="250"></el-table-column>
    </el-table>
  </div>
</template>
<script type="text/ecmascript-6">
  import Vue from 'vue';
  import {
    api
  } from '../../../global/api.js';
  export default {
    data() {
      return {
        tableData: [],//患者信息
        name: ''//搜索的关键字
      };
    },
    created() {//初始化
      this.inio();
    },
    methods: {
      inio() {
        let me = this;
		//查询需处理药方的患者信息
        let apilogin = "http://localhost:8088/getPatientList"
        this.$http.get(apilogin).then(function(response) {
          console.log(response.body);
          me.tableData = response.body.data.list;
        }, function() {
          me.$message.error('数据获取失败!');
        });
      },
      handleSearch() {//搜索
        let me = this;
        let apilogin = "http://localhost:8088/getName/"+this.name
        this.$http.get(apilogin).then(function(response) {
          console.log(response.body);
          me.tableData = response.body.data.Patient;
        }, function() {
          me.$message.error('未找到改姓名的人!');
          me.inio();
        });
      }
    }
  };
</script>
